<template>
    <div>
        <group title="">
            <x-input title="姓名" v-model="name" placeholder-align="right" placeholder="请填写"></x-input>
            <x-input title="手机号" required v-model="phone" type="tel" placeholder-align="right" is-type="china-mobile" placeholder="请填写"></x-input>
            <x-input title="我有什么" required v-model="have" placeholder-align="right" placeholder="请填写"></x-input>
            <x-textarea title="需要什么" required v-model="need" :max="200" placeholder="" :rows="3"></x-textarea>
        </group>
        <div style="padding:15px;">
            <x-button type="primary" @click.native="doSend">提交</x-button>
        </div>
    </div>
</template>
<script>
import {
    XTextarea,
    XInput,
    Group,
    XButton
} from 'vux'
import api from '../api';

export default {
    components: {
        XTextarea,
        XInput,
        Group,
        XButton
    },
    mounted: function() {
        // this.getData();
    },
    updated: function() {

    },
    activated:function(){
        this.name="";
        this.phone="";
        this.have="";
        this.need="";
    },
    methods: {
        go(name) {
            this.$router.push(`/${name}`)
        },
        doSend() {
            if(!this.isMob(this.phone)) return this.$vux.toast.show({text:"请填电话",type: 'warn'});
            if(this.have.length ==0) return this.$vux.toast.show({text:"我有什么",type: 'warn'});
            if(this.need.length ==0) return this.$vux.toast.show({text:"需要什么",type: 'warn'});
            let data = { name: this.name ,phone:this.phone ,have:this.have,need:this.need};
            api.cooperateAdd(data).then(()=>{
                this.need = "" ;
                this.$vux.toast.show({text:"提交成功",type: 'success'});
            })
            console.log("send:",data);
        }
    },
    data() {
        return {
            name:"",
            phone:"",
            have:"",
            need:"",
        }
    }
}
</script>
<style scoped>

</style>
